//自评表
<template>
    <div class="container">
        <div class="flex-one">
            <div>
                <select>
                    <option>6炉</option>
                    <option>7炉</option>
                    <option>8炉</option>
                </select>
            </div>
            <div>
                <input type="text" placeholder="2018年10月11日" v-model="dateTime" @click="openPicker"/>

            </div>
            <div>
                <select>
                    <option>甲班</option>
                    <option>乙班</option>
                    <option>丙班</option>
                </select>
            </div>

        </div>
        <div class="flex-2">
            <div>
                <p>均值</p>
            </div>
            <div>
                <table class="table table-border">
                    <thead>
                    <tr>
                        <th>风量</th>
                        <th>氧量</th>
                        <th>Q值</th>
                        <th>风温</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>4915</td>
                        <td>5171</td>
                        <td>5409</td>
                        <td>1157</td>
                    </tr>
                    </tbody>
                    <thead>
                    <tr>
                        <th>H2</th>
                        <th>CCT1</th>
                        <th>CCT2</th>
                        <th>TP</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>3.09</td>
                        <td>614</td>
                        <td>488</td>
                        <td>230</td>
                    </tr>
                    </tbody>
                </table>
                <table class="table table-border">
                    <thead>
                    <tr>
                        <th>湿分</th>
                        <th>透指</th>
                        <th>△p</th>
                        <th>ηCO</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>17.55</td>
                        <td>88</td>
                        <td>168</td>
                        <td>47.02</td>
                    </tr>
                    </tbody>
                    <thead>
                    <tr>
                        <th>Z</th>
                        <th>Z/W</th>
                        <th>Q值</th>
                        <th>风压</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>279.08</td>
                        <td>114.59</td>
                        <td>207.96</td>
                        <td>3.11</td>
                    </tr>
                    </tbody>
                </table>

            </div>

        </div>
        <div class="flex-2">
            <div>
                <p>标准差</p>
            </div>
            <div>

                <table class="table table-border">
                    <thead>
                    <tr>
                        <th>湿分</th>
                        <th>透指</th>
                        <th>△p</th>
                        <th>ηCO</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>17.55</td>
                        <td>88</td>
                        <td>168</td>
                        <td>47.02</td>
                    </tr>
                    </tbody>
                    <thead>
                    <tr>
                        <th>Z</th>
                        <th>Z/W</th>
                        <th>Q值</th>
                        <th>风压</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>279.08</td>
                        <td>114.59</td>
                        <td>207.96</td>
                        <td>3.11</td>
                    </tr>
                    </tbody>
                </table>
                <table class="table table-border">
                    <thead>
                    <tr>
                        <th>CCT1</th>
                        <th>CCT2</th>
                        <th>W4</th>
                        <th>W</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>17.55</td>
                        <td>88</td>
                        <td>168</td>
                        <td>47.02</td>
                    </tr>
                    </tbody>
                    <thead>
                    <tr>
                        <th>西南（6）</th>
                        <th>西北（11）</th>
                        <th>东北（16）</th>
                        <th>东南（21）</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>279.08</td>
                        <td>114.59</td>
                        <td>207.96</td>
                        <td>3.11</td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div class="table-container">
            <table class="table table-border">
                <thead>
                <tr>
                    <th>项目</th>
                    <th>目标</th>
                    <th>实际</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>料批（ch）</td>
                    <td>48±1</td>
                    <td>48.26</td>
                </tr>
                <tr>
                    <td>理论铁（t）</td>
                    <td>1850</td>
                    <td>1951</td>
                </tr>
                <tr>
                    <td>PT（℃）</td>
                    <td>1495-1520</td>
                    <td>1502</td>
                </tr>
                <tr>
                    <td>FR(kg/t)</td>
                    <td>520±3</td>
                    <td>521</td>
                </tr>
                <tr>
                    <td>铁量差（t）</td>
                    <td>≤50</td>
                    <td>10</td>
                </tr>
                <tr>
                    <td>加减风次数</td>
                    <td>≤2</td>
                    <td>1</td>
                </tr>
                <tr>
                    <td>管道次数（次）</td>
                    <td>0</td>
                    <td>0</td>
                </tr>
                <tr>
                    <td>硅偏差（0.2-0.5%）</td>
                    <td>≥70</td>
                    <td>33.333%</td>
                </tr>
                <tr>
                    <td>加轻料</td>
                    <td></td>
                    <td></td>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="msg">
            <p>1.{{msg}}</p>

        </div>
        <mt-datetime-picker type="date" ref="picker" year-format="{value} 年" month-format="{value} 月"
                            date-format="{value} 日" @confirm=" handleConfirm">
        </mt-datetime-picker>
    </div>
</template>

<script>
    //   import echarts from "echarts";

    export default {
        name: "furnaceEvaluation",
        data() {
            return {
                dateTime: "2018年10月11日",
                msg:'炉况顺行，风量基本维持在，风压波动相对稳定，负压',

            }
        },
        mounted() {

        },
        methods: {
            openPicker() {
                this.$refs.picker.open()
            },
            handleConfirm(data) {
                this.dateTime = data.getFullYear() + '年' + (parseInt(data.getMonth()) + 1) + '月' + data.getDate() + '日'
            }
        }
    };
</script>

<style lang="scss" scoped>
    .container{
        padding-bottom: 28px;
    }
    select option {
        font-size: 12px;
    }

    .flex-one {
        display: flex;
        div:nth-child(1) {
            flex: 2;
            & > select {
                font-size: 14px;
                height: 30px;
            }
        }
        div:nth-child(2) {
            flex: 2;
            & > input {
                height: 30px;
                border: none;
                background: #dddddd;
                width: 80%;
            }
        }
        div:nth-child(3) {
            flex: 1;
            & > select {
                font-size: 14px;
                height: 30px;
            }
        }
    }

    .flex-2 {
        width: 100%;
        display: flex;
        margin-top: 10px;
        div:nth-child(1) {
            flex: 2;
            & > p {
                width: 100%;
                height: 100%;
                border: 1px solid #dddddd;
                line-height: 214.5px;
                text-align: center;

            }
        }
        div:nth-child(2) {
            flex: 7;

        }
    }
    .table > caption + thead > tr:first-child > td, .table > caption + thead > tr:first-child > th, .table > colgroup + thead > tr:first-child > td, .table > colgroup + thead > tr:first-child > th, .table > thead:first-child > tr:first-child > td, .table > thead:first-child > tr:first-child > th {
        border-top:1px solid #dddddd;
    }
    .table-container{
        margin-top: 10px;
    }
    .msg{
        margin-top: 10px;
        width: 100%;
        height: 80px;
        overflow: auto;
        border: 1px solid #dddddd;
        box-sizing: border-box;
    }

</style>
